<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>已发起租车</title>
		<!-- import CSS -->
		<link rel="stylesheet" href="/static/element-ui/lib/theme-chalk/element.css">
		<!-- import Vue before Element -->
		<script src="/static/js/vue.js"></script>
		<!-- import JavaScript -->
		<script src="/static/element-ui/lib/index.js"></script>
		<style>
			.divCss {
				width: 100%;
				height:100%;
				/* 边框属性 */
				border: 1px solid #cccccc;
				border-radius: 2px;
				/* 内边距 */
				padding: 10px;
				margin: 0 auto;
				/* 投影 */
				box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
			}
		</style>
	</head>
	<body>
		<div id="div_news">
			<div class="divCss">
				<template>
					<!-- border启用边框  heighit固定表头 fixed：固定列-->
					<el-table :data="tableData" border height="600px" style="width: 100%">
						<el-table-column prop="carpool_id" label="拼车id" width="120">
						</el-table-column>
						<el-table-column prop="carpool_info" label="拼车详情" width="500">
						</el-table-column>
						<el-table-column prop="carpool_time" label="拼车时间" width="100">
						</el-table-column>
						<el-table-column prop="flag" label="拼车状态" width="120">
						</el-table-column>
						<el-table-column prop="s_address" label="起始地址" width="120">
						</el-table-column>
						<el-table-column prop="g_address" label="目的地址" width="120">
						</el-table-column>
						<el-table-column prop="section" label="拼车时间段" width="120">
						</el-table-column>
						
						<el-table-column fixed="right" label="操作" width="90">
							<template slot-scope="scope">								
								<el-button type="text" size="small">删除</el-button>
							</template>
						</el-table-column>
					</el-table>
				</template>
			</div>

		</div>

		<script>
			var app = new Vue({
				el: '#div_news',
				methods: {
					handleClick(row) {
						console.log(row);
					}
				},
				data: {
					tableData: [{
						carpool_id: '拼车id',
						carpool_info: '拼车详情',
						carpool_time: '拼车时间',
						flag: '拼车状态',
						s_address: '起始地址',
						g_address: '目的地址',
						section:'拼车时间段',
						right:'操作'
					}, {
						carpool_id: '拼车id',
						carpool_info: '拼车详情',
						carpool_time: '拼车时间',
						flag: '拼车状态',
						s_address: '起始地址',
						g_address: '目的地址',
						section:'拼车时间段',
						right:'操作'
					}, {
						carpool_id: '拼车id',
						carpool_info: '拼车详情',
						carpool_time: '拼车时间',
						flag: '拼车状态',
						s_address: '起始地址',
						g_address: '目的地址',
						section:'拼车时间段',
						right:'操作'
					}, 
					]

				},

			})
		</script>
	</body>
</html>
